﻿@section scripts
{
    <link href="~/Content/frontend/slider/slidy/slidy.css" rel="stylesheet" />
    <script src="~/Content/frontend/slider/slidy/slidy.js"></script>
    <script type="text/javascript" src="~/Scripts/App/Guest/index.js"></script>
    <link href="~/Content/frontend/homepage.css" rel="stylesheet" />
}

<section class="homepage-hero">
    <div class="video video-homepage" data-bind="if: IsVideo, visible: IsVideo">
        <figure class="embed-section">
            <iframe width="560" height="315" frameborder="0" wmode="Opaque"
                data-bind="attr: { src: 'http://www.youtube.com/embed/' + VideoLink() + '?&rel=0&showinfo=0&disablekb=1&controls=0&color=white&modestbranding=1&wmode=transparent' }"></iframe>
        </figure>
    </div>
    <div class="video video-homepage" data-bind="if: IsFlash, visible: IsFlash">
        Link Flash:
        <p data-bind="text: FlashLink()"></p>
    </div>
    <div class="video video-homepage" data-bind="if: IsImage, visible: IsImage">
        <div id="slidyBanner" class="slidyContainer" title="Your tooltip text">
            <div class="slidySlides" data-bind="foreach: AdvImages">

                <!-- Each slide is wrapped in figure section -->

                <!-- Slide 1 -->
                <!-- add the 'slidyCurrent' class to which slide you want as default -->
                <figure class="slidyCurrent">
                    <!-- Your context goes here -->
                    <img data-bind="attr: { src: MediaLink }" alt="" />
                    <!-- Use the figcaption element to add captions -->
                    <figcaption>An Image</figcaption>
                </figure>
                <!-- Add more slides as necessary -->

            </div>
        </div>
    </div>
    <div class="am-content">
        <div class="top-bar">
            <ul>
                <li>
                    <input type="text" placeholder="Tìm kiếm" class="search no-margin" data-bind="value: SearchString, enterKey: SearchAdv">
                </li>
                <li><span>Tebbee company</span></li>
            </ul>
        </div>
        <div class="clear"></div>
        <div class="am-container" id="am-container">
            <div data-bind="foreach: AdvShows">
                <div class="mix">
                    <a data-bind="html: HtmlTag, click: $root.BindAdvertise"></a>
                    <div class="tooltip" data-bind="text: Title"></div>
                </div>
            </div>
        </div>
    </div>

</section>
<section class="contact-hero">
    <div class="row">
        <div class="title large-12 columns">
            <h2>Contact</h2>
        </div>
        <div class="large-12 columns">
            <div class="map">
                <iframe class="span12" height="350" src="https://maps.google.com/?ie=UTF8&amp;ll=37.0625,-95.677068&amp;spn=42.224734,79.013672&amp;t=m&amp;z=4&amp;output=embed"></iframe>
            </div>
        </div>
        <div class="large-12 medium-12 columns">
            <div class="row margin-top-30">
                <div class="large-8 medium-8 columns">
                    <form>
                        <h3 class="upper font-size-18">Contact form</h3>
                        <div class="control-group">
                            <label class="control-label span2" for="inputName">Name:</label>
                            <div class="controls">
                                <input type="text" id="inputName">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label span2" for="inputEmail">Email:</label>
                            <div class="controls">
                                <input type="text" id="inputEmail">
                            </div>
                        </div>
                        <div class="control-group">
                            <label class="control-label span2" for="inputMessage">Message:</label>
                            <div class="controls">
                                <textarea id="inputMessage" class="span6"></textarea>
                            </div>
                        </div>
                        <div class="control-group">
                            <div class="controls">
                                <button type="submit" class="button small right">Submit</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="large-4 medium-4 columns">
                    <h3 class="upper font-size-18">Contact Details</h3>
                    <p class="size12">
                        Address: Colorado Springs<br>
                        Phone: 719-327-0805<br>
                        Fax: 650-22-7340<br>
                        Web: http://esmeth.com
                    </p>
                </div>
            </div>
        </div>
    </div>

</section>
